import React, { useEffect } from 'react';
import { useStoreHook, useStateHook, useDispatchHook } from 'think-react-store';

export default function(props) {

  const { user: { id, username, getUserAsync } } = useStoreHook();

  const states = useStateHook('user');
  const dispatch = useDispatchHook();
  console.log(states);
  useEffect(() => {
    getUserAsync({
      id: 10,
      username: '张三',
    });
  }, []);
  const handleClick = () => {
    // getUserAsync({
    //   id: 20,
    //   username: '李四',
    // });
    dispatch({
      key: 'user',
      type: 'getUserAsync',
      payload: {
        id: 20,
        username: '王五',
      },
    });
  };
  return (
    <div>
      user-id:{id}
      <br />
      username:{username}
      <button onClick={handleClick}>修改</button>
    </div>
  );
}
